<template>
    <div class="common-layout">
        <el-container>
            <el-header class="header">
                <div class="one">
                    <div class="img">
                        <el-avatar class="i" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png" />
                    </div>
                    <div>
                        <span>李建安</span>
                        <span>女</span>
                        <span>76岁</span>
                        <p style="margin-bottom: -20px;">入住号:123848511315</p>
                        <span style="display:inline-block; margin-left: 300px;">身份证号：4654588465431</span>
                    </div>
                    <p style="float: right; margin-top: -70px;">入住时段
                        <el-select v-model="value" placeholder="Select" style="width: 240px;margin-right: -150px;">
                            <el-option v-for="item in time" :key="item.value" :label="item.label" :value="item.value" />
                        </el-select>
                    </p>
                    <div>
                        <el-radio-group v-model="radio1">
                            <el-checkbox value="1" size="large" border @click="m">老人档案</el-checkbox>
                            <el-checkbox value="2" size="large" border @click="m">医疗档案</el-checkbox>
                            <el-checkbox value="3" size="large" border @click="m">护理档案</el-checkbox>
                        </el-radio-group>
                    </div>
                </div>
            </el-header>
            <!-- <el-main>
                <el-menu class="el-menu-demo" mode="horizontal" >
                    <el-menu-item index="1">医嘱列表</el-menu-item>
                    <el-menu-item index="2">巡诊记录</el-menu-item>
                    <el-menu-item index="3">会诊记录</el-menu-item>
                    <el-menu-item index="4">个人健康体检表</el-menu-item>
                    <el-menu-item index="5">多维度健康综合评估</el-menu-item>
                </el-menu>
            </el-main> -->
            <el-main>
                <el-menu class="el-menu-demo" mode="horizontal" router>
                    <el-menu-item index="/bian">护理等级变更表</el-menu-item>
                    <el-menu-item index="/lu">护理记录表</el-menu-item>
                    <el-menu-item index="/tang">血糖监测表</el-menu-item>
                    <el-menu-item index="/ti">体温趋势表</el-menu-item>
                </el-menu>
            </el-main>
        </el-container>
        <div class="childer">
            <router-view></router-view>
        </div>
    </div>
</template>
    
    
<script lang="ts" setup>
import { Search } from "@element-plus/icons-vue";
import { ref } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { ElNotification } from "element-plus";
import type { TabsPaneContext } from 'element-plus'

const activeName = ref('first')


const value = ref("")
const labelPosition = ''
const radio1 = ''
const time = [{
    value: '2022-2023', label: '2022-2023'
}, {
    value: '2022-2023', label: '2022-2023'
}, {
    value: '2022-2023', label: '2022-2023'
},]
const m=()=>{
   console.log(radio1);
   
    
}
</script>
    
    
<style scoped>
.common-layout {
    width: 1200px;
    height: 1000px;
}

table {
    text-align: center;
    margin-top: -600px;
    width: 1000px;
    height: 600px;
}

.header {
    width: 1000px;
    height: 300px;
    background-color: aliceblue;

}

.childer {
    margin-top: 600px;
}

.el-menu-demo {
    width: 1150px;
}

.el-menu-item {
    width: 150px;
}

td {
    border: 1px solid rgb(242, 242, 242);
}

.one {
    width: 800px;
    height: 100px;
}

img {
    width: 100px;
    height: 100px;
}

span {
    display: inline-block;
    margin-right: 30px;
    margin-bottom: 20px;
}

.img {
    float: left;
    border-radius: 10px;
}

.demo-tabs>.el-tabs__content {
    padding: 32px;
    color: #6b778c;
    font-size: 32px;
    font-weight: 600;
}

.i {
    width: 70px;
    height: 70px;
}
</style>